<template>
    <div>
        <el-card class="form-container" shadow="never">
            <el-button @click="queryList">查询</el-button>
        </el-card>
        <el-card class="form-container" style="margin-top: 25px;" shadow="never">
            <el-table :data="listTabData" style="width: 100%">
                <el-table-column prop="id" label="编号" width="180"></el-table-column>
                <el-table-column prop="name" label="分类名称" width="180"></el-table-column>
                <el-table-column prop="level" label="级别" :formatter="levelFormat" width="180"></el-table-column>
                <el-table-column prop="productCount" label="商品数量" width="180"></el-table-column>
                <el-table-column prop="productUnit" label="数量单位" width="180"></el-table-column>

                <el-table-column  label="导航栏">
                    <template slot-scope="scope">
                        <el-switch disabled v-model="scope.row.navStatus"  :active-value=1 :inactive-value=0></el-switch>
                    </template>
                </el-table-column>
                <el-table-column  label="是否显示">
                    <template slot-scope="scope">
                        <el-switch disabled v-model="scope.row.showStatus"  :active-value=1 :inactive-value=0></el-switch>
                    </template>
                </el-table-column>
                <el-table-column prop="sort" label="排序" width="180"></el-table-column>

                <el-table-column fixed="right" label="操作" width="100">
                    <template slot-scope="scope">
                        <el-button @click="editAttribute(scope.row)" type="text" size="small">编辑</el-button>
                        <el-button @click="deleteAttribute(scope.row)" type="text" size="small">删除</el-button>
                    </template>
                </el-table-column>
            </el-table> 
        </el-card>
    </div>
</template>

<script>
import {queryPmsProductCategoryList, pmsDelete} from '@/api/pmsApi'
export default {
    name: 'PmsProductCategoryList',
    data() {
        return {
            listTabData:[

            ]
        }
    },
    
    mounted() {
        this.doQueryList();
    },

    methods: {
        queryList() {
            this.doQueryList();
        },

        doQueryList() {
            queryPmsProductCategoryList({}).then(response => {
                this.listTabData = response.data;
            });
        },

        editAttribute() {
            this.$message("该功能暂未开放!");
        },

        deleteAttribute(row) {
            //const id = row.id;
            let params = {
                id: row.id,
                type: 1
            };
            pmsDelete(params).then(response => {
                this.$message("删除商品类型成功!");
                this.doQueryList();
            });
        },

        levelFormat(row, column) {
            const level = row.level;
            if (level == 0) {
                return '一级';
            }
            if (level == 1) {
                return '二级';
            }
            return '';
        }
    }
}
</script>    

<style>

</style>